/**
 * All rights Reserved, Designed By 信鸥科技
 * project : lawyer-design
 * Created by youquer on 17/12/5.
 * 注意：本内容仅限于信鸥科技有限公司内部传阅，禁止外泄以及用于其他的商业目的
 * Description:
 *
 */
/**
 * All rights Reserved, Designed By 信鸥科技
 * project : committee
 * Created by youquer on 17/10/25.
 * 注意：本内容仅限于信鸥科技有限公司内部传阅，禁止外泄以及用于其他的商业目的
 * Description:
 *
 */
//React
import React from 'react';
import PropTypes from 'prop-types';
//Dva
import { Link } from 'dva/router';
import { connect } from 'dva'
//antd
import { Form, Input, DatePicker, Row, Col, Tabs, Icon, Button, Card } from 'antd';
import PageHeaderLayout from '@/layouts/PageHeaderLayout';
const FormItem = Form.Item;
const TabPane = Tabs.TabPane;
//style
import styles from './PermissionAdd.less';
//common
import AddInput from '@/components/common/AddInput';
//import SmartTreeSelectInput from '../../components/common/SigleTreeSelect';

const PermissionAdd = ({permission, dispatch}) => {
  /**
   * formItemLayout: 添加页输入框样式,
   * labelCol: 左侧标题 xs:24等分, sm: 宽
   * wrapperCol: 右侧标题 xs, sm: 宽; 数值越大越宽
   * */
  const formItemLayout = {
    labelCol: {
      xs: { span: 24 },
      sm: { span: 4 },
    },
    wrapperCol: {
      xs: { span: 24 },
      sm: { span: 20 },
    },
  };

  const formItemTwoLayout = {
    labelCol: {
      xs: { span: 24 },
      sm: { span: 8 },
    },
    wrapperCol: {
      xs: { span: 24 },
      sm: { span: 16 },
    },
  };

  /**
   * patrol:model数据
   * loading: 提交按钮加载效果
   * */
  const {type, isUpdate, parentTree, appTree, appId, name, isMenu, parentId, url, isEnable, sort,} = permission;
  const data = permission;

  /**
   * 一排多个输入框的间距
   * */
  const gutter = {gutter: 2};

  var inputcolumns = [];
  if (isUpdate == 1){ //修改
    if (data.isMenu){
      inputcolumns = [
        [
          {
            title: "应用",
            type:"Input",
            //help: "sshelp",
            hasFeedback: true,
            placeholder: "",
            validateStatus: "",
            required: true,
            formItemLayout: {...formItemTwoLayout},
            disabled: true,

            key: 'appName',
          },
          {
            title: "名称",
            type:"Input",
            //help: "sshelp",
            hasFeedback: true,
            placeholder: "最多输入10个字",
            validateStatus: "",
            required: true,
            formItemLayout: {...formItemTwoLayout},
            max: 10,

            key: 'name',
          },
        ],
        [
          {
            title: "菜单",
            type:"Switch",
            hasFeedback: true,
            validateStatus: "",
            required: true,
            formItemLayout: {...formItemLayout},

            checkedChildren: "是",
            unCheckedChildren: "否",

            key: 'isMenu',
          },
        ],
        [
          {
            title: "排序",
            type:"InputNumber",
            //help: "sshelp",
            hasFeedback: true,
            placeholder: "",
            validateStatus: "",
            required: true,
            formItemLayout: {...formItemTwoLayout},

            key: 'sort',
          },
          {
            title: "可用",
            type:"Switch",
            //help: "sshelp",
            hasFeedback: true,
            placeholder: "",
            validateStatus: "",
            required: true,
            formItemLayout: {...formItemTwoLayout},

            checkedChildren: "是",
            unCheckedChildren: "否",

            key: 'isEnable',
          },
        ],
        {
          title: "url",
          type:"Input",
          //help: "sshelp",
          hasFeedback: true,
          placeholder: "最多输入50",
          validateStatus: "",
          required: true,
          formItemLayout: {...formItemLayout},
          max: 50,

          key: 'url',
        },
      ];
    } else {
      inputcolumns = [
        [
          {
            title: "应用",
            type:"Input",
            //help: "help",
            hasFeedback: true,
            placeholder: "",
            validateStatus: "",
            required: true,
            formItemLayout: {...formItemTwoLayout},
            disabled: true,

            key: 'appName',
          },
          {
            title: "名称",
            type:"Input",
            //help: "sshelp",
            hasFeedback: true,
            placeholder: "最多输入10个字",
            validateStatus: "",
            required: true,
            formItemLayout: {...formItemTwoLayout},
            max: 10,

            key: 'name',
          },
        ],
        [
          {
            title: "菜单",
            type:"Switch",
            //help: "sshelp",
            hasFeedback: true,
            placeholder: "",
            validateStatus: "",
            required: true,
            formItemLayout: {...formItemTwoLayout},

            checkedChildren: "是",
            unCheckedChildren: "否",

            key: 'isMenu',
          },
          {
            title: "所属菜单",
            type:"SmartTreeSelectInput",
            //help: "sshelp",
            hasFeedback: true,
            placeholder: "",
            validateStatus: "",
            required: true,
            formItemLayout: {...formItemTwoLayout},

            key: 'parentId',
            smart:  parentTree,
          },
        ],
        [
          {
            title: "排序",
            type:"InputNumber",
            //help: "sshelp",
            hasFeedback: true,
            placeholder: "",
            validateStatus: "",
            required: true,
            formItemLayout: {...formItemTwoLayout},

            key: 'sort',
          },
          {
            title: "可用",
            type:"Switch",
            //help: "sshelp",
            hasFeedback: true,
            placeholder: "",
            validateStatus: "",
            required: true,
            formItemLayout: {...formItemTwoLayout},

            checkedChildren: "是",
            unCheckedChildren: "否",

            key: 'isEnable',
          },
        ],
        {
          title: "url",
          type:"Input",
          //help: "sshelp",
          hasFeedback: true,
          placeholder: "最多输入50",
          validateStatus: "",
          required: true,
          formItemLayout: {...formItemLayout},
          max: 50,

          key: 'url',
        },
      ];
    }
  } else { //添加
    if (data.isMenu){
      inputcolumns = [
        [
          {
            title: "应用",
            type:"SmartTreeSelectInput",
            //help: "sshelp",
            hasFeedback: true,
            placeholder: "",
            validateStatus: "",
            required: true,
            formItemLayout: {...formItemTwoLayout},

            key: 'appId',
            smart:  appTree,
            callBack: "/selectCallBack"
          },
          {
            title: "名称",
            type:"Input",
            //help: "sshelp",
            hasFeedback: true,
            placeholder: "最多输入10个字",
            validateStatus: "",
            required: true,
            formItemLayout: {...formItemTwoLayout},
            max: 10,

            key: 'name',
          },
        ],
        [
          {
            title: "菜单",
            type:"Switch",
            //help: "sshelp",
            hasFeedback: true,
            placeholder: "",
            validateStatus: "",
            required: true,
            formItemLayout: {...formItemLayout},

            checkedChildren: "是",
            unCheckedChildren: "否",

            key: 'isMenu',
          },
        ],
        {
          title: "url",
          type:"Input",
          //help: "sshelp",
          hasFeedback: true,
          placeholder: "最多输入50",
          validateStatus: "",
          required: true,
          formItemLayout: {...formItemLayout},
          max: 50,

          key: 'url',
        },
      ];
    } else {
      inputcolumns = [
        [
          {
            title: "应用",
            type:"SmartTreeSelectInput",
            //help: "help",
            hasFeedback: true,
            placeholder: "",
            validateStatus: "",
            required: true,
            formItemLayout: {...formItemTwoLayout},

            key: 'appId',
            smart:  appTree,
            callBack: "/selectCallBack"
          },
          {
            title: "名称",
            type:"Input",
            //help: "sshelp",
            hasFeedback: true,
            placeholder: "最多输入10个字",
            validateStatus: "",
            required: true,
            formItemLayout: {...formItemTwoLayout},
            max: 10,

            key: 'name',
          },
        ],
        [
          {
            title: "菜单",
            type:"Switch",
            //help: "sshelp",
            hasFeedback: true,
            placeholder: "",
            validateStatus: "",
            required: true,
            formItemLayout: {...formItemTwoLayout},

            checkedChildren: "是",
            unCheckedChildren: "否",

            key: 'isMenu',
          },
          {
            title: "所属菜单",
            type:"SmartTreeSelectInput",
            //help: "sshelp",
            hasFeedback: true,
            placeholder: "",
            validateStatus: "",
            required: true,
            formItemLayout: {...formItemTwoLayout},

            key: 'parentId',
            smart:  parentTree,
          },
        ],
        {
          title: "url",
          type:"Input",
          //help: "sshelp",
          hasFeedback: true,
          placeholder: "最多输入50",
          validateStatus: "",
          required: true,
          formItemLayout: {...formItemLayout},
          max: 50,

          key: 'url',
        },
      ];
    }
  }




  const param = {
    inputcolumns,
    type,
    data,
    gutter,
  };

  //提交按钮
  var addInfo = {appId, name, isMenu, url, parentId};
  const updata = {appId, name, isMenu, url, parentId, isEnable, sort};
  function enterLoading(){
    dispatch({
      type:type+"/submit",
      loading:true
    });
    var act = "/add"; //添加
    if (isUpdate == 1){ //修改
      act = "/update";
      dispatch({
        type:type+act,
        payload: updata
      });
    } else {
      dispatch({
        type:type+ act,
        payload:addInfo
      });
    }
  }

  return(
    <PageHeaderLayout title={isUpdate? "修改权限": "添加权限"} content="">
      <Card bordered={false}>
        <div className={styles.add_div}>
          <AddInput {...param} />
          <div className={styles.submit_div}>
            <Button type="primary" onClick={enterLoading}>
              确定
            </Button>
          </div>
        </div>
      </Card>
    </PageHeaderLayout>
  )
};

export default connect(
  ({permission}) => ({permission})
)(PermissionAdd);
